import 'cube.css/src/scss/neat.scss'
import 'static/font/iconfont.css'
import 'element-ui/lib/theme-default/index.css'
import './square.scss'
import '@/base/scss/common.scss'
import Vue from 'vue'
import ElementUI from 'element-ui'
import UnifyHeader from 'components/header/header'
import UnifyFooter from 'components/footer/footer'
import Suspension from 'components/suspension/suspension'
import mixins from '@/mixins'
import Api from '@/api.js'
import Utils from '../../components/component/util'
import {DEVELOPMENT, PRODUCTION} from "../../config"

let apiHost = process.env.NODE_ENV === 'development' ? DEVELOPMENT : PRODUCTION

Vue.mixin(mixins)
Vue.use(ElementUI)
Vue.use(Utils)

let bbsSlsectDate = {}
// eslint-disable-next-line no-new
new Vue({
  el: '#app',
  data: {
    showSuspensionHeight: 0,
    picturePrefix: `http://${apiHost.IMAGE_API_HOST}/`,
    nowSize: '',
    attributeValues: {},
    oSrcImg: '',
    price: 0,
    showIs: true, //判断显示隐藏
    lineIndex: 0, //选中的索引
    productList: [{
      label: '旅行记',
      category: 'lvxingji',
      index: 0,
      defDbId: '2ef25e96-adcb-4612-b701-fe91b4856218',
      editCnfName: 'pc_lvxingji_250X250_32_single',
      tplCode: 'pc_lvxingji_250X250_32',
      parameter: 'lvxingji.250X250.32'
    }, {
      label: '毕业季',
      category: 'biyeji',
      index: 1,
      defDbId: 'f76d86bb-cffd-11e7-ab6d-c88d8360f6c1',
      editCnfName: 'pc_biyeji_250X250_32_single',
      tplCode: 'pc_biyeji_250X250_32',
      parameter: 'biyeji.white.250X250.32'
    }, {
      label: '遇见.情缘',
      category: 'qixishu',
      index: 2,
      defDbId: '70295084-cfec-11e7-ab6d-c88d8360f6c1',
      editCnfName: 'pc_qixishu_250X250_32_single',
      tplCode: 'pc_qixishu_250X250_32',
      parameter: 'qixishu.white.250X250.32'
    }]
  },
  methods: {
    suspendPackUp: function () {
      let $el = this.$refs.suspend.$el
      $el.style.height = '38px'
      setTimeout(() => {
        $el.removeAttribute('style')
      }, 20)
    },
    suspendPullDown: function () {
      let $el = this.$refs.suspend.$el
      $el.style.height = '154px'
    },
    //开始定制
    startCustom() {
      if (this.showIs) {
        this.$message({
          showClose: true,
          iconClass: 'atrup_Message',
          message: '请先选择您需要定制的主题 !',
          type: 'success'
        })
        return
      }
      if (localStorage['userDbId']) {
        let titleName = sessionStorage['titleName']
        let url = '/album/travelEdit'
        if (titleName === '毕业季') {
          url = '/album/biyejiEdit'
        } else if (titleName === '遇见情缘') {
          url = '/album/qixishuEdit'
        }
        location.href = url
      } else {
        this.setUrlCallback()
      }
    },
    checkColor(args) {
      let category = args.category
      let index = args.index
      let defDbId = args.defDbId
      let editCnfName = args.editCnfName
      let tplCode = args.tplCode
      let parameter = args.parameter
      this.showIs = false
      this.lineIndex = index
      this.dynamicAlterUrl({
        theme: this.lineIndex
      })
      sessionStorage['urlQuery'] = JSON.stringify({
        category: category,
        defDbId: defDbId,
        tplCode: tplCode
      })
      let titleName = '旅行记'
      if (index) {
        titleName = index === 1 ? '毕业季' : '遇见情缘'
      }
      sessionStorage['titleName'] = titleName
      bbsSlsectDate.editCnfName = editCnfName
      this.getData2()
      this.updataSkuData2(parameter)
      return true
    },
    /*更新sku*/
    updataSkuData() {
      let category = this.getFromSession('category')
      this.skuCode = `${category}.${this.nowSize}`
      Api.sku.querySku({
        category: category,
        parameter: this.skuCode
      }).then(res => {
        bbsSlsectDate.tplCode = res.data.templateCode
        bbsSlsectDate.skuId = res.data.skuId
        bbsSlsectDate.price = res.data.price
        this.price = res.data.price
        this.oSrcImg = res.data.previewImageUrl
        bbsSlsectDate.category = res.data.category
        setTimeout(() => {
          sessionStorage['bbsSlsectDate'] = JSON.stringify(bbsSlsectDate)
          let tplCode = JSON.parse(sessionStorage['urlQuery'])
          tplCode.tplCode = res.data.templateCode
          sessionStorage['urlQuery'] = JSON.stringify(tplCode)
        }, 20)
      })
    },
    /*更新sku*/
    updataSkuData2(parameter) {
      let category = this.getFromSession('category')
      Api.sku.querySku({
        category: category,
        parameter: parameter
      }).then(res => {
        bbsSlsectDate.tplCode = res.data.templateCode
        bbsSlsectDate.skuId = res.data.skuId
        bbsSlsectDate.price = res.data.price
        this.price = res.data.price
        this.oSrcImg = res.data.previewImageUrl
        bbsSlsectDate.category = res.data.category
        setTimeout(function () {
          sessionStorage['bbsSlsectDate'] = JSON.stringify(bbsSlsectDate)
          let tplCode = JSON.parse(sessionStorage['urlQuery'])
          tplCode.tplCode = res.data.templateCode
          sessionStorage['urlQuery'] = JSON.stringify(tplCode)
        }, 20)
      })
    },
    // 获取最初数据
    getData(munber) {
      Api.sku.queryAttributes({category: this.getFromSession("category")}).then(res => {
        console.log(res)
        let attributeValues = res.data.attributes
        bbsSlsectDate.name = res.data.name + '.' + attributeValues[0].attributeValues[0].code + '.' + attributeValues[1].attributeValues[0].code + '页'
        bbsSlsectDate.skuCode = res.data.code + '.' + attributeValues[0].attributeValues[0].code + '.' + attributeValues[1].attributeValues[0].code
        bbsSlsectDate.size = attributeValues[0].attributeValues[0].code
        this.nowSize = bbsSlsectDate.skuCode
        this.updataSkuData()
      })
    },
    getData2() {
      Api.sku.queryAttributes({category: this.getFromSession("category")}).then(res => {
        let attributeValues = res.data.attributes
        bbsSlsectDate.name = res.data.name + '.' + attributeValues[0].attributeValues[0].code + '.' + attributeValues[1].attributeValues[0].code + '页'
        bbsSlsectDate.skuCode = res.data.code + '.' + attributeValues[0].attributeValues[0].code + '.' + attributeValues[1].attributeValues[0].code
        bbsSlsectDate.size = attributeValues[0].attributeValues[0].code
      })
    }
  },
  mounted() {
    let that = this
    this.$nextTick(function () {
      that.showSuspensionHeight = that.$refs.showSuspensionFlag.offsetTop
    })
  },
  created: function () {
    sessionStorage['urlQuery'] = JSON.stringify({
      category: this.getQueryString('category', this.productList[0].category),
      defDbId: this.getQueryString('defDbId', this.productList[0].defDbId),
      tplCode: this.getQueryString('tplCode', this.productList[0].tplCode)
    })
    let theme = +this.getQueryString('theme', -1)
    if (theme >= 0) {
      this.lineIndex = theme
      this.showIs = false
    }
    sessionStorage['titleName'] = '旅行记'
    bbsSlsectDate.editCnfName = 'pc_lvxingji_250X250_32_single'
    this.getData(0)
    document.body.style.cssText = 'opacity:1;'
  },
  components: {
    UnifyHeader,
    UnifyFooter,
    Suspension
  }
})

